<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head th:include="common_css :: commonHeader('流程图片')"></head>
<body>
<!-- 1.获取到规则流程图 -->
<img id="image" style="position: absolute;top: 0px;left: 0px;">
<!-- 2.根据当前活动的坐标，动态绘制DIV -->
<div id="imagediv"></div>
<script type="text/javascript"
        th:src="@{/jquery-easyui/jquery.min.js}"></script>
<script type="text/javascript"
        th:src="@{/jquery-easyui/jquery.easyui.min.js}"></script>
<script type="text/javascript"
        th:src="@{/jquery-easyui/locale/easyui-lang-zh_CN.js}"></script>
<!--fromAjax-->
<script th:src="@{/js/jquery.form.js}" type="text/javascript"></script>
<script type="text/javascript"
        th:src="@{/js/common.js}"></script>
<script type="text/javascript" th:inline="javascript">
    $(function () {
        var deploymentId = [[${deploymentId}]];
        var imageName = [[${imageName}]];
        var acs = [[${acs}]];
        $("#image").attr("src", activiti + "/activitiRepository/view?deploymentId=" + deploymentId + "&imageName=" + imageName);
        if (!isNull(acs)) {
            $("#imagediv").attr("style", "position: absolute;border:1px solid red;top:" + acs.y + "px;left:" + acs.x + "px;width:" + acs.width + "px;height:" + acs.height + "px;");
        }
    })
</script>
</body>
</html>